<template>
  <div v-if="!byFlag">
    <!--    <div class="warpSq" v-if="showQx">-->
    <!--      <span class="waspan">请用户同意授权并且配合注册基础信息</span>-->
    <!--      <button class="button" type="primary" open-type="getAuthorize" ref="clickbtn"-->
    <!--              @getAuthorize="onGetAuthorize" scope='userInfo'>同意获取用户信息-->
    <!--      </button>-->
    <!--    </div>-->
    <DzMain ref="dzmain" v-if="!byFlag">
      <button
              class="button"
              type="primary"
              open-type="getAuthorize"
              ref="clickbtn"
              @getAuthorize="onGetAuthorize"
              scope="userInfo"
      >
        同意获取用户信息
      </button>
    </DzMain>
  </div>
</template>

<script>
  import store from "@/store/store";
  import DzMain from "@/components/DzMain";
  import { isEmpty } from "lodash";

  export default {
    name: "chose",
    components: {
      DzMain
    },
    data() {
      return {
        modalOpened: false,
        byFlag: false,
        autuCodeFLag: false,
        userInfoFlag: false,
        qxFlag: false,
        qxLoad: false,
        dz: false,
        count: 0,
        refreshFlag: false,
        addComponyId: ""
      };
    },
    computed: {
      showQx() {
        if (this.autuCodeFLag === true && this.userInfoFlag === true) {
          return false;
        }
        return this.qxFlag;
      },
      userId() {
        // 用户授权码
        return store.state.userId;
      },
      buyer() {
        // 用户授权码
        return store.state.buyer;
      },
      authCode() {
        // 用户授权码
        return store.state.authCode;
      },
      userInfo() {
        // 用户基础信息
        return store.state.userInfo;
      }
    },
    methods: {
      openModal() {
        this.modalOpened = true;
      },
      getFlag() {
        return store.state.buyer;
      },
      setAuthCode(res) {
        this.autuCodeFLag = true;
        store.commit("setAuthCode", res.authCode);
      },
      setUserInfo(res) {
        this.userInfoFlag = true;
        store.commit("setUserInfo", res);
      },
      getUserInfo(res) {
        this.mpvue.getAuthUserInfo({
          fail: res => {
            this.showQx = true;
            this.dz = false;
          },
          success: res => {
            // 以下方的报文格式解析两层 response
            let userInfo = res;
            this.byFlag = false;
            console.log(JSON.stringify(userInfo));
            if (!isEmpty(userInfo)) {
              this.setUserInfo(userInfo);
              this.$refs.dzmain.getData();
              if (this.autuCodeFLag === false) {
                this.onGetAuthorize();
              }
            } else {
              this.qxFlag = true;
            }
          }
        });
      },
      onGetAuthorize(res) {
        let that = this;
        this.mpvue.getAuthCode({
          scopes: "auth_user",
          fail: res => {
            if (!isEmpty(that.userInfo)) {
              this.showQx = true;
            }
          },
          success: res => {
            this.getUserInfo();
            this.setAuthCode(res);
          }
        });
      }
      // 获取用户信息
    },
    onLoad(options) {
      // this.addComponyId = options.sjid
      // this.mpvue.alert({content: '启动参数：' + JSON.stringify(options)})
      if (this.buyer === true) {
        // this.mpvue.alert({content: '请退出小程序!'})
        this.byFlag = true;
        const url = "/pages/exitPg/index";
        this.mpvue.navigateTo({ url });
      }
    },
    mounted() {
      // 获取用户授权码
      if (this.buyer === true) {
        return;
      }
      // this.onGetAuthorize();
    },
    onShow() {
      this.byFlag = true;
      console.log("show");
      if (this.autuCodeFLag === true && this.userInfoFlag === true) {
        this.byFlag = false;
        this.$refs.dzmain.getData();
      } else {
        this.onGetAuthorize();
      }
    },
    onPullDownRefresh() {
      if (this.autuCodeFLag === true && this.userInfoFlag === true) {
        this.$refs.dzmain.getData(() => {
          this.mpvue.stopPullDownRefresh();
        });
      }
    }
  };
</script>

<style scoped lang="scss">
  @import "../../common/common";

  .warpSq {
    height: 80vh;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
  }

  .waspan {
    margin-bottom: 5px;
  }

  .button {
    padding: 0px 10px;
  }

</style>
